<%--
  Created by IntelliJ IDEA.
  User: 门铎
  Date: 2016/6/24
  Time: 9:56
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Title</title>
    <!-- BOOTSTRAP STYLES-->
    <link href="${pageContext.request.contextPath}/css/bootstrap.css" rel="stylesheet" />
    <!-- FONTAWESOME STYLES-->
    <link href="${pageContext.request.contextPath}/css/font-awesome.css" rel="stylesheet" />
    <!--CUSTOM BASIC STYLES-->
    <link href="${pageContext.request.contextPath}/css/basic.css" rel="stylesheet" />
    <!--CUSTOM MAIN STYLES-->
    <link href="${pageContext.request.contextPath}/css/custom.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/css//jquery.dataTables.min.css" rel="stylesheet" />
</head>
<body>
<div id="wrapper">
    <jsp:include page="../manage/nav-top.jsp"/>
    <jsp:include page="../manage/nav.jsp"/>
    <!-- /. NAV SIDE  -->
    <div id="page-wrapper">
        <div id="page-inner">
            <div class="row">
                <div class="col-md-12">
                    <ol class="breadcrumb">
                        <li><a href="#">首页</a></li>
                        <li class="active">友情链接</li>
                    </ol>
                    <hr />
                    <ul class="nav nav-pills">
                        <li class="active">
                            <a href="${pageContext.request.contextPath}/cimv/flink/list">
                                <i class="glyphicon glyphicon-user"></i>友情链接列表
                            </a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/cimv/flink/new">
                                <i class="glyphicon glyphicon-plus"></i>新建友情链接
                            </a>
                        </li>
                    </ul>
                    <hr />
                </div>

            </div>
            <div class="row">
                <div class="col-md-12">
                    <table id="myTable" class="table table-bordered table-striped table-hover data-table">
                        <thead>
                        <tr>
                            <th>id</th>
                            <th>友情链接名称</th>
                            <th>url地址</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <c:set var="index" value="0" />
                        <c:forEach var="flink" items="${flinkList}">
                            <c:set var="index" value="${index+1}" />
                            <tr>
                                <td>${index}</td>
                                <td>${flink.title}</td>
                                <td>${flink.url}</td>
                                <td>
                                   <a href="/cimv/flink/update/${flink.id}" class="btn btn-xs btn-info">
                                       <i class="glyphicon glyphicon-pencil"></i> 编辑
                                   </a>
                                   <button  title="${flink.id}" class="btn btn-xs btn-danger delete" data-toggle="modal"
                                            data-target="#myModal">
                                       <i class="glyphicon glyphicon-remove"></i> 删除
                                   </button>
                                </td>
                               <!-- 模态框（Modal） -->
                               <div class="modal fade" id="myModal" tabindex="-1" role="dialog"
                                    aria-labelledby="myModalLabel" aria-hidden="true">
                                   <div class="modal-dialog">
                                       <div class="modal-content">
                                           <div class="modal-header">
                                               <button type="button" class="close"
                                                       data-dismiss="modal" aria-hidden="true">
                                                   &times;
                                               </button>
                                               <h4 class="modal-title" id="myModalLabel">
                                                   提示
                                               </h4>
                                           </div>
                                           <div class="modal-body">
                                               确定要删除当前友情链接么？
                                           </div>
                                           <div class="modal-footer">
                                               <button type="button" class="btn btn-default"
                                                       data-dismiss="modal">关闭
                                               </button>
                                               <button  id="delete"  type="button" class="btn btn-primary" data-dismiss="modal">
                                                   确定
                                               </button>
                                           </div>
                                       </div><!-- /.modal-content -->
                                   </div><!-- /.modal -->
                               </div>
                               <div  id="myModal2" class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
                                   <div class="modal-dialog modal-sm">
                                       <div class="modal-content">
                                           <div class="modal-header">
                                               <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                               <h4 class="modal-title" id="exampleModalLabel">提示</h4>
                                           </div>

                                           <div class="modal-body">
                                               <div id="myModel2Msg" class="alert alert-success">
                                                   发布成功！
                                               </div>
                                           </div>
                                       </div>
                                   </div>
                               </div>
                           </tr>
                       </c:forEach>

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <!-- /. PAGE WRAPPER  -->
</div>
<!-- /. WRAPPER  -->

<jsp:include page="../manage/footer.jsp" />
<!-- SCRIPTS -AT THE BOTOM TO REDUCE THE LOAD TIME-->
<!-- JQUERY SCRIPTS -->
<script src="${pageContext.request.contextPath}/js/jquery-1.10.2.js"></script>
<!-- BOOTSTRAP SCRIPTS -->
<script src="${pageContext.request.contextPath}/js/bootstrap.js"></script>
<!-- METISMENU SCRIPTS -->
<script src="${pageContext.request.contextPath}/js/jquery.metisMenu.js"></script>
<!-- CUSTOM SCRIPTS -->
<script src="${pageContext.request.contextPath}/js/custom.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.dataTables.min.js"></script>
<script src="${pageContext.request.contextPath}/js/dateTable.boostrap.js"></script>
<script>
    $(function(){
        $(".delete").click(function(){
            var id = $(this).attr("title");
            $("#delete").attr("title",id);
        })
    });
    $(function(){
        $("#delete").click(function(){
            var id = $(this).attr("title");
            deleteNotices(id);
        });
    });
    function deleteNotices(id) {
      $.ajax({
        url: '${pageContext.request.contextPath}/cimv/flink/delete/'+id,
        type: 'GET',
        dataType: 'json'
      })
      .done(function(data) {
        $('#myModel2Msg').html(""+data.msg);
                        $('#myModal2').modal('show');
                        setTimeout(function () {
                            $('#myModal2').modal('hide');
                            window.location.reload();//成功后刷新页面
                        },1000*2);
      })
      .fail(function() {
        console.log("error");
      })
      .always(function() {
        console.log("complete");
      });
      
    }
    /*
    dataTable 最后在加载
     */
    $(document).ready(function(){
        $('#myTable').DataTable({
            language: {
                "sProcessing": "处理中...",
                "sLengthMenu": "显示 _MENU_ 项结果",
                "sZeroRecords": "没有匹配结果",
                "sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
                "sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",
                "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
                "sInfoPostFix": "",
                "sSearch": "搜索:",
                "sUrl": "",
                "sEmptyTable": "表中数据为空",
                "sLoadingRecords": "载入中...",
                "sInfoThousands": ",",
                "oPaginate": {
                    "sFirst": "首页",
                    "sPrevious": "上页",
                    "sNext": "下页",
                    "sLast": "末页"
                },
                "oAria": {
                    "sSortAscending": ": 以升序排列此列",
                    "sSortDescending": ": 以降序排列此列"
                }
            }
        });
    });

</script>

</body>

</html>
